<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>P183 8.2.2 常用属性和方法</title>
</head>

<body>
    <button id="btn" class="btnClass">获取event对象</button>
    <script>
        var btn = document.getElementById('btn');
        btn.onclick = function (e) {
            var obj = event.target || window.event.srcElement;
            console.log(obj.nodeName);
            console.log(obj.id);
            console.log(obj.innerText);
        };
    </script>
    <div id="red">
        <div id="green">
            <div id="yellow"></div>
        </div>
    </div>
    <script>
        var red = document.getElementById('red');
        var green = document.getElementById('green');
        var yellow = document.getElementById('yellow');
        red.onclick = function () { console.log('red'); };
        green.onclick = function () { console.log('green'); };
        yellow.onclick = function () { console.log('yellow'); };
        if (window.event) {
            window.event.cancelBubble = true;
        } else {
            e.stopPropagation();
        }
    </script>
    <a id="test" href="http://www.example.com">默认链接</a>
    <script>
        document.getElementById('test').onclick = function (e) {
            if (window.event) {
                window.event.returnValue = false;
            } else {
                e.preventDefault();
            }
        };
    </script>
    <a href="../首页/page08.html">
        <h2>返回上一页面</h2>
    </a>
</body>

</html>